<template>
  <div class="app-container" v-loading="loading" element-loading-background="rgba(255, 255, 255, 0.6)">
    <el-form ref="form" :model="form" label-width="80px">
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>无线</span>
        </div>
        <div class="text item">
          <el-form-item label="4G" style="margin-bottom: 0">
            <el-switch :active-value="1" :inactive-value="0"  v-model="form.modem"></el-switch>
          </el-form-item>
        </div>
      </el-card>

      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>有线</span>
        </div>
        <div class="text item">
          <el-form-item label="IP">
            <el-col :span="12">
              <el-input v-model="form.ip"></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="网关">
            <el-col :span="12">
              <el-input v-model="form.gateway"></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="掩码">
            <el-col :span="12">
              <el-input v-model="form.mask"></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="dns1">
            <el-col :span="12">
              <el-input v-model="form.dns1"></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="dns2">
            <el-col :span="12">
              <el-input v-model="form.dns2"></el-input>
            </el-col>
          </el-form-item>
        </div>
      </el-card>
      <el-button @click="setnetparam" type="primary">保存</el-button>
    </el-form>
    <restart-tool ref="restartOpt" @closeDialog="closeDialog" :newIP="form.newIP" :dialogVisible="dialogVisible"></restart-tool>
  </div>
</template>

<script>
  import restartTool from '../public/restartConfirm'
    export default {
        name: "networkParameters",
      data:function () {
        return{
          form: {
            ip: '',
            gateway: '',
            mask: '',
            dns1: '',
            dns2: '',
            oldip:'',
            newIP:''
          },
          loading: false,
          dialogVisible: false,
          restartStatus:false,
        }
      },
      components:{
        'restart-tool':restartTool
      }
      ,methods:{
        showView:function(){
          this.dialogVisible=true
        },
        closeDialog:function(){
          this.dialogVisible=false
        },
          getnetparam:function(){
            var _this=this
          _this.postAjax({
            method:'getnetparam',
            params:{}
          }).then(function (res) {
            console.log(res);
            if(res.result==0){
              var data=res.params
              // debugger
              _this.form.ip=data.ip
              _this.form.gateway=data.gateway
              _this.form.modem=data.modem
              _this.form.mask=data.mask
              _this.form.dns1=data.dns1
              _this.form.dns2=data.dns2
              _this.form.oldip=data.ip

              console.log(_this.form.oldip);
            }
          }).catch(function (err) {
            console.log(err);
          }).finally(function (fn) {
            console.log(fn);
          })
        },
        setnetparam:function () {
          var _this=this
          _this.loading=true
          _this.postAjax({
            method:'setnetparam',
            params:{
              ip:_this.form.ip,
              gateway:_this.form.gateway,
              modem:_this.form.modem,
              mask:_this.form.mask,
              dns1:_this.form.dns1,
              dns2:_this.form.dns2
            }
          }).then(function (res) {
            _this.form.newIP=_this.form.ip
            console.log(res);
            if(res.result==0){
              // _this.tips('保存成功','success')
              // debugger
              if(_this.form.ip!=_this.form.oldip){
                // debugger
                _this.$confirm('更改成功，重启后生效?', '提示', {
                  confirmButtonText: '立即重启',
                  cancelButtonText: '稍后重启',
                  type: 'warning'
                }).then(() => {
                  console.log('即将显示重启窗口');
                  _this.$refs.restartOpt.restart()
                  // _this.dialogVisible=true
                  // _this.$message({
                  //   type: 'success',
                  //   message: '立即重启!'
                  // });
                }).catch(() => {
                  _this.form.oldip=_this.form.ip
                  // _this.$message({
                  //   type: 'info',
                  //   message: '稍后重启'
                  // });
                  console.log('oldip',_this.form.oldip);
                });
              }else{
                _this.tips('保存成功','success')
              }
              // var data=res.params
              // // debugger
              // _this.form.ip=data.ip
              // _this.form.gateway=data.gateway
              // _this.form.mask=data.mask
              // _this.form.dns1=data.dns1
              // _this.form.dns2=data.dns2
            }else {
              _this.tips(res.errorInfo.detail,'error')
            }
          }).catch(function (err) {
            console.log(err);
          }).finally(function (fn) {
            _this.loading=false
            console.log(fn);
          })
        }

      },mounted:function () {
        console.log(this.postAjax);
        this.getnetparam()
      }
    }
</script>

<style scoped>
  .box-card {
    width: 480px;
    margin-bottom: 20px;
  }
</style>
